<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="Copyright" content>
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge, chrome=1">
    <!-- <meta name="apple-mobile-web-app-capable" content="no">
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="renderer" content="webkit">
    <meta name="format-detection" content="telephone=no">
    <meta name="HandheldFriendly" content="true">
    <meta name="MobileOptimized" content="320">
    <meta name="screen-orientation" content="portrait">
    <meta name="x5-orientation" content="portrait">
    <meta name="full-screen" content="yes">
    <meta name="x5-fullscreen" content="true">
    <meta name="browsermode" content="application">
    <meta name="x5-page-mode" content="app">
    <meta name="msapplication-tap-highlight" content="no"> -->
    <title>排课</title>
    <link rel="stylesheet" href="../css/reset.min.css">
    <link href="../css/mui.min.css" rel="stylesheet"/>
    <!-- <link rel="stylesheet" href="../css/mui.picker.min.css"> -->
    <!-- <link rel="stylesheet" href="../css/mui.poppicker.css"> -->
    <link rel="stylesheet" href="../css/arranging.css">
    <link rel="stylesheet" href="../js/sui-mobile.css">
    <style type="text/css" media="screen">
     body{
        max-width: 640px;
        margin: 0 auto;
        overflow: auto;
        background: transparent;
     }
    
    .RaContent .picker-columns{
        height: 4.5rem;
    }
    .RaContent .bar.bar-nav{
        height: 0.77rem;
    }
    .RaContent .button.button-link.pull-right.close-picker{
        font-size:.18rem;
        height: 0.77rem;
        line-height: 0.77rem;
        width: .6rem;
        right: -0.3rem;
    }
    .RaContent .bar .title{
        height: 0.77rem;
        line-height: 0.77rem;
        font-size:.22rem;
    }
    .RaContent .bar+.picker-items{
        height: 100%;
    }
    .picker-modal-inner .picker-item{
        font-size: 0.2rem;
        width: 300px;
    }
    .toast {
        height: .5rem;
        line-height:0.5rem;
        font-size:0.2rem;
        padding: 0 0.15rem;
    }
    .info-cont li{
        line-height: 1;
    }
    .info-cont  li>div{
        height: .7rem;
        height: .7rem;
        height: .7rem;
        height: .7rem;
    }
    .info-cont>li div>label,
    .info-cont>li div>input,
    .info-cont>li div>span{
        line-height: 4;
        display: inline-block;
        vertical-align: middle;
    }
   #Course, #Class, #select-Address, #select-teacher {
        height: .5rem;
        line-height: .5rem;
        vertical-align: middle;
        margin-bottom: 0px;
        color:#666;
    }
     .info-cont  li.long{
        margin-top: -.15rem;
     }
     .info-cont  li.long div{
        height: 0.5rem;
    }
    .info-cont  li.long div span,
    .info-cont  li.long div label{
        height: 0.5rem;
         line-height: 1.2;
        display: inline-block;
        vertical-align: middle;
    }
    @media screen and (min-width:640px){
       
        .picker-modal.picker-columns.remove-on-close{
         max-width: 640px;
         left:50%;
         margin-left:-320px;
        }
        .picker-modal .picker-item{
           height: 60px;
           line-height: 60px;
         }
        .picker-modal .picker-center-highlight{
           height: 60px;
           margin-top: -30px;
         }


    }
    </style>
   
   
    <script>
     !(function(){
        var b=document.documentElement,a=function(){var a=b.getBoundingClientRect().width;b.style.fontSize=(100/640)*(a>=640?640:a)+"px";},c=null;
        window.addEventListener("resize",function(){clearTimeout(c);c=setTimeout(a,300);});a();
      })();
     </script>
</head>
<body class="RaContent">
	<div class="table-box">
        <div class="left-side">
            <div class="t"></div>
            <ul>
                <li><span>09:00</span><span>10:30</span></li>
                <li><span>10:30</span><span>12:00</span></li>
                <li><span>13:00</span><span>14:30</span></li>
                <li><span>14:30</span><span>16:00</span></li>
                <li><span>16:00</span><span>17:30</span></li>
                <li><span>18:30</span><span>20:00</span></li>
                <!-- <li><span>19:40</span><span>21:10</span></li> -->
            </ul>
        </div>
        <div class="side-box">
            <div class="side-scroll">
                <ol class="week-box flex">
                    <li id="select-teacher1">周一</li>
                    <li>周二</li>
                    <li>周三</li>
                    <li>周四</li>
                    <li>周五</li>
                    <li>周五</li>
                    <li>周五</li>
                    <li>周五</li>
                    <li>周五</li>
                    <li>周六</li>
                    <li>周日</li>
                </ol>
                <div class="class-box">
                    <ul class="flex">
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                         <li><div></div></li>
                    </ul>
                    <ul class="flex">
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                         <li><div></div></li>
                    </ul>
                    <ul class="flex">
                    <li><div></div></li>
                    <li><div></div></li>
                    <li><div></div></li>
                    <li><div></div></li>
                    <li><div></div></li>
                    <li><div></div></li>
                     <li><div></div></li>
                </ul>
                    <ul class="flex">
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                         <li><div></div></li>
                    </ul>
                    <ul class="flex">
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                         <li><div></div></li>
                    </ul>
                    <ul class="flex">
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                        <li><div></div></li>
                         <li><div></div></li>
                    </ul>
                    <!--<ul class="flex">-->
                        <!--<li><div></div></li>-->
                        <!--<li><div></div></li>-->
                        <!--<li><div></div></li>-->
                        <!--<li><div></div></li>-->
                        <!--<li><div></div></li>-->
                        <!--<li><div></div></li>-->
                         <!--<li><div></div></li> -->
                    <!--</ul>-->
                </div>
            </div>
        </div>
    </div>
    <div class="info-box">
        <ul class="info-cont">
            <li class="flex" data-g="true">
                <div><label>学员姓名:</label><span class="ClassName"></span></div>
                <!-- <div><label>性别:</label><span></span></div> -->
                
                <div><label>上课时间:</label><span  id="StartTime"></span></div>
            </li>
            <!-- <li class="flex" data-g="true">
                <div><label>学员生日:</label><span></span></div>
                <div><label>学龄:</label><span></span></div>
            </li> -->
            <li class="flex" data-g="false">
                <div id="Classgroup"><label>所选年级:</label>
                <!-- <span id="Class" ><i class="mui-icon mui-icon-arrowdown"></i></span> -->
                 <input type="text" id="Class" class="teacher-btn" placeholder="请选择年级" readonly="readonly">
                </div>
                <div id="Coursegroup"><label>所选课程:</label>
                <!-- <span id="Course" class="teacher-btn">请选择<i class="mui-icon mui-icon-arrowdown"></i></span> -->
                <input type="text" id="Course" class="teacher-btn" placeholder="请选择课程" readonly="readonly">
                </div>
            </li>
           <!--  <li class="flex" data-g="false">
                <div><label>开课日期:</label><span id="StartData"></span></div>
                <div><label>开课时间:</label><span id="StartTime"></span></div>
            </li> -->
            <li class="flex" data-g="false">
                <div><label>教室:</label>
                <!-- <span id=""></span> -->
                <input type="text" id="select-Address" class="teacher-btn" readonly="readonly" placeholder="请选择教室" >
                </div>
                <div>
                    <label>授课老师:</label>
                    <!-- <span id="select-teacher"></span> -->
                    <input type="text" id="select-teacher" class="teacher-btn" placeholder="请选择老师" readonly="readonly">
                </div>
            </li>
            <!-- <li class="flex long" data-g="false">
                <div><label>该时间段课程状态:</label><span id="ClassStatus"></span></div>
            </li> -->
            <li class="hr"></li>
            <li class="flex long" data-g="false">
                <div><label>该教室最大容纳学员数:</label><span id="ClassNumber"></span></div>
            </li>
            <li class="flex long" data-g="false">
                <div><label>当前已报名学员数:</label><span id="NowNUmber"></span></div>
            </li>
        </ul>
    </div>
    <div class="bot-btns">
        <div class="btns flex" style="height: 100%;">
            <!-- <button class="edit">新增排课</button> -->
            <button class="add-btn">加入班级</button>
        </div>
    </div>
</body>
<script src="../js/zepto.min.js"></script>
<script src="../js/sui-mobile.js"></script>
<!-- <script src="../js/mui.picker.min.js"></script>
<script src="../js/mui.poppicker.js"></script>
<script src="../js/mui.min.js"></script> -->
<script src="../js/base.js"></script>
<script src="../js/app_common.js"></script>
<script src="../js/RoutineArrang_page.js"></script>
</html>